<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
		<title></title>
		<script src="js/jquery-2.1.4.min.js"></script>
		<script src="js/common.js"></script>
		<script src="js/mui.min.js"></script>
    	<link href="css/mui.min.css" rel="stylesheet"/>
    	<link href="css/style.css" rel="stylesheet"/>
	</head>
	<body>
		<div class="container">
			<header class="mui-bar mui-bar-nav layout-bg">
			    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left l-arrow"></a>
			    <h1 class="mui-title">登录</h1>
			</header>
			
			<div id="refreshContainer" class="mui-content mui-scroll-wrapper" style="padding-top: 0;">
  			<div class="mui-scroll">
			    <!--数据列表-->
			    <ul class="mui-table-view mui-table-view-chevron">
			    	</ul>
			    </div>
			   </div>
			  </div>
			
			<div class="login-wrapper">
				<form class="auth-data">
					<div class="mui-flex bor-b">
						<div class="cell fixed">
							<span class="auth-text">手机号/用户名</span>
						</div>
						<div class="cell">
							<input class="auth-input" type="text" name="username" value="" placeholder="请输入用户名或手机号码" />
						</div>
					</div>
					<div class="mui-flex">
						<div class="cell fixed">
							<span class="auth-text">登录密码</span>
						</div>
						<div class="cell">
							<input class="auth-input" type="password" name="password" value="" placeholder="请输入登录密码" />
						</div>
					</div>
				</form>
			</div>
			
			<button type="button" class="auth-btn layout-bg">立即登录</button>
			
			<div class="login-bottom flex-box">
				<a class="flex mui-text-center reg-href">
					还没<span class="reg-text">注册？</span>
				</a>
				<a class="flex mui-text-center find-password">忘记密码</a>
			</div>
		</div>
		
		<script type="text/javascript">
			$(function() {
				$('.auth-btn').on('click', function() {
					var param = $('.auth-data').serializeObject();
					
					if (param.username === '') {
						mui.toast('请输入用户名或手机号');
						return;
					}
					if (param.password === '') {
						mui.toast('请输入登录密码');
						return;
					}
				});
				
				mui.plusReady(()=> {
					mui('.login-bottom').on('tap', '.reg-href', ()=> {
						mui.openWindow({
			    			url: 'register.html',
			    			id: 'register.html'
			    		})
					});
				
					mui('.login-bottom').on('tap', '.find-password', ()=> {
						mui.openWindow({
			    			url: 'find-password.html',
			    			id: 'find-password.html'
			    		});
					})
				})
			})
		</script>
	</body>
</html>
